// 由于需要大量用到上下文中的方法和属性

// 所以，setup函数一定要定义为function
export default function() {
	const { $ref, $val, $reactive } = $modules;
	// 实际开发中，响应式数据并不一定满足最终渲染条件
	// 比如需要对值加一些形如组成句子，等等
	const user = $reactive({ name: '坤坤', age: 18 });

	this.add(
		this.render({
			children: $val(user, {
				// 监听字段age的变化
				field: 'age',
				// 响应数据变化时的处理函数
				// 该函数的返回值为干预后的最终结果值
				done: age => {
					return `我叫${user.name},今年${age}岁`
				}
			}),
			// 点击试试
			onClick: () => {
				user.age += 2;
			}
		})
	)
}